import React, { Component } from "react";
import axios from "axios";
import PubSub from "pubsub-js";
export default class Serach extends Component {
  getInfo = () => {
    const {
      keyWordElement: { value },
    } = this;
    PubSub.publish("aska", { isFirst: false, isLoading: true });
    axios.get(`http://localhost:3000/api1/search/users2?q=${value}`).then(
      (response) => {
        PubSub.publish("aska", { isLoading: false, users: response.data.items });
      },
      (error) => {
        PubSub.publish("aska", { isLoading: false, err: error.message });
      }
    );
  };
  render() {
    return (
      <section className="jumbotron">
        <h3 className="jumbotron-heading">Search Github Users</h3>
        <div>
          <input ref={(c) => (this.keyWordElement = c)} type="text" placeholder="enter the name you search" />
          &nbsp;<button onClick={this.getInfo}>Search</button>
        </div>
      </section>
    );
  }
}
